<template>
	<view class="search_history">
		<p class="title">搜索历史</p>
		<ul>
			<li v-for="(item, index) in search_history" @click="search(item)">{{item}}</li>
		</ul>
	</view>
</template>
 
<script>
	import {keySearch} from "@/network/axios/search/keySearch"
	
	export default {
		name: '',
		props: {
			search_history: {
				type: Array,
				default() {
					return []
				}
			}
		},
		data(){
			return {
				result: []
			}
		},
		methods:{
			async search(item) {
				//1、根据关键词搜索
				const { data: res } = await keySearch(item)
				this.result = res.result.songs
				this.$store.commit("updataSearch", this.result)
				//3、跳转页面
				uni.navigateTo({
					url: `./SeResult?keywords=${item}`
				})
			}
		}
	}
</script>
 
<style lang="less" scoped>
	.search_history {
		padding: 10px 10px 10px 10px;
		font-size: 30upx;
		background-color: #f1f2f6;
		ul {
			display: flex;
			padding: 5px 0;
			margin-top: 10px;
			flex-wrap: wrap;
			li {
				background-color: #fff;
				padding: 5px;
				margin-right: 5px;
				margin-bottom: 5px;
				border-radius: 10px;
			}
		}
	}
</style>
